<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
	</head>
	<body>
		<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js"></script>
	
		<div id="root">
			<child content="hello world"></child>
		</div>


    <script type="text/javascript">
		Vue.component('child',{
			template:'<div>{{content}}</div>',
			props:{
				// 检验content必须是一个字符串
				// content:String
				// 检验content必须是一个数字
				// content:Number

				// 检验content必须是一个字符串或者数字

				// content:[Number,String]

				content:{
					type:String,
					// 必须存在
					required:true,
					// required:false

					// 没传递时的默认值
					// default:'default value'

					validator:function(value){
						return(value.length>5)
					}
				}

			}
		})
		var app=new Vue({
			el:'#root',

		})
	</script>
	</body>
</html>
